// pages/getredbag/getredbag.js
var util = require('../../utils/util.js');
Page({
  /**
   * 页面的初始数据
   */
  data: {
    flexmodel: true,
    showmodel: false,
    gameagain: false,
    anmPopData: {}, //  
    anmFyData: {},  //  
    tapanmFyData: {},
    anmHbData: {},
    tips: '找到躲起来的福利吧',
    array: ['难度设置', '简单 不限制', '正常 最多10次', '困难 最多8次', '变态 最多5次'],
    speed: '600', //切换的速度ms
    num: '2', //切换的次数
    cards: [],
    grid: [
      {
        left: 204,
        top: 204,
        width: 186,
        height: 186,
      },
      {
        left: 154, 
        top: 154,
        width: 136,
        height: 136,
      },
      {
        left: 122,
        top: 122,
        width: 114,
        height: 114,
      }

    ],
    cardbg: '/image/open-win.png', // 翻过来的背景图片
    index: 0,
    zIndex: 0, // 控制 背景图片 的 z-index
    count: 25, // 卡片数量 只能，9 ，16 ，25
    timeout: '', //关闭定时器
    timeint: '', // 关闭延时器
    ontap: true, //阻止点击红包
  },
  // 点击单个卡片 开奖
  onTap: function (e) {
    var _this = this;
    // 是否开始点击功能？
    if (_this.data.ontap) { return } 
    // ishb 红包是否在这
    var ishb = e.currentTarget.dataset.hb;

    var animation = wx.createAnimation({
      duration: 700,
      timingFunction: 'ease',
    })

    animation.rotateY(0).step();
    this.setData({
      anmFyData: animation.export()
    });

    setTimeout(function () {
      this.setData({
        zIndex: 0
      });
    }.bind(this), 100);

    if (ishb) {
      console.log('中了');
      setTimeout(function () {
        this.Flexmodel();
      }.bind(this), 1000);
      this.setData({
          ontap: true, //关闭点击
      });
    } else {
      this.setData({
        tips: '没点中呢，注意力要集中哦',
        gameagain: true,
        ontap: true, //关闭点击
      });
    }
  },
  // 再找一次
  gameAgain: function () {
    this.setData({
      tips: '找到躲起来的福利吧',
      gameagain: false
    });
    this.startFind();
  },

  // 红包移动效果
  move: function () {
    var exp = [];
    var counts = this.data.count - 1;
    var cards = this.data.cards;
    // console.log(cards);
    var random = util.getRandomArr(0, counts);
    // console.log(random);
    for (let i = 0; i < random.length; ++i) {
      exp[i] = { 'left': cards[random[i]].left, 'top': cards[random[i]].top };
    }
    for (let i = 0; i < cards.length; ++i) {
      cards[i].left = exp[i].left;
      cards[i].top = exp[i].top;
    }
    // console.log(exp);
    this.setData({
      cards: cards,
      ontap: false, //开启点击
    });

  },

  // 所有卡片翻转到背面效果
  fyAnm: function () {
    var animation = wx.createAnimation({
      duration: 700,
      timingFunction: 'ease',
    })
    animation.rotateY(-180).step()
    this.setData({
      anmFyData: animation.export()
    });

    // 红包开始运动
    var i = 0;
    var speeds = +this.data.speed + 100;
    this.data.timeint = setInterval(function () {
      i++;
      if (i >= this.data.num) {  //切换的次数
          clearInterval(this.data.timeint);
      }
      this.move();

    }.bind(this), speeds);

    setTimeout(function () {
      this.setData({
        zIndex: 9
      });
    }.bind(this), 100);
  },

  // 开始找福利
  startFind: function () {
    // 执行填充卡片数据
    this.fillCardData();

    // 打开弹层效果
    var animation = wx.createAnimation({
      duration: 700,
      timingFunction: 'ease',
    })
    animation.scale(1, 1).opacity(1).step()
    this.setData({
      anmPopData: animation.export()
    })
  },
  // 关闭弹层效果
  closeView: function () {
      var animation = wx.createAnimation({
          duration: 700,
          timingFunction: 'ease',
      })
      var animation2 = wx.createAnimation({
          duration: 700,
          timingFunction: 'ease',
      })
      animation2.rotateY(0).step()
      animation.scale(0, 0).opacity(0).step()
      this.setData({
          anmPopData: animation.export(),
          anmFyData: animation2.export(),
          zIndex: 0,
          ontap: true, //关闭点击
          tips: '找到躲起来的福利吧',
          gameagain: false
      })
      clearInterval(this.data.timeint);
      clearTimeout(this.data.timeout);
  },

  // 填充卡片数据
  fillCardData: function () {
    let allCard = [];
    let length = this.data.count;
    let grids = this.data.grid;
    var grid,
        numb;
    if(length === 9){
      grid = grids[0];
      numb = 3;
    }else if(length ===16){
      grid = grids[1];
      numb = 4;
    }else if (length === 25) {
      grid = grids[2];
      numb = 5;
    }
    
    var j = 0;
    var random = Math.round(Math.random() * (length-1));
    for (let i = 0; i < length; ++i) {
      if (i % numb == 0) {
        j += 1;
      }
      allCard.push({
        left: (i % numb) * grid.left,
        top: (j * grid.top) - grid.top,
        width: grid.width,
        height: grid.height,
        speed: this.data.speed,
        id: "card_" + i,
        hb: random == i ? true : false,
      });
    }

    this.setData({
      cards: allCard
    });

    // 红包抖动完后 执行翻转所有卡片动画
    this.data.timeout = setTimeout(function () {
        this.fyAnm();
    }.bind(this), 2500);


    console.log(this.data.cards);
  },

  bindPickerChange: function (e) {
    // console.log('picker发送选择改变，携带值为', e.detail.value)
    this.setData({
      index: e.detail.value
    })
  },
  Flexmodel: function () {
    this.setData({
      flexmodel: !(this.data.flexmodel),
    })
  },
  hideModel: function () {
    this.closeView();
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

  },


})